/*首页公共样式*/ 
.home-title{
    width:100%;
    margin-top:56px;
    height:31px;
    line-height:31px;
    margin-bottom:20px;
    & h1{
        font-size:24px;
        color:#000;
    }
    & a,& span{
        color:#666;
        font-size:12px;
    }
    & a:hover{
        color:#6699cc;
    }
    & span {
        margin: 0 5px;
    }
    .submuen {
        & span:last-child{
            display:none;
        }
    }
    .more{
        margin-left:40px;
    }
}
.imgSize{
    width:100%;
    height:100%;
}

/*banner*/ 
.banner{
    width:1170px;
    height:420px;
    position: relative;
    margin:0 auto;
    .slider{
        width:1920px;
        height:420px;
        position:absolute;
        overflow: hidden;
        left:-375px;
        /*图片破防容器*/ 
        .slider-swiper{
            width:1000em;
            height:420px;
            overflow: hidden;
            & li{
                float:left;
                width:1920px;
                height:420px;
                & img{
                    @extend .imgSize;
                }
            }
        }
        /*小圆点*/
        .slider-icon{
            position:absolute;
            bottom:5px;
            width:100%;
            height:6px;
            text-align:center;
            & span{
                 
            }
            .swiper-pagination-bullet{
                 display:inline-block;
                 width:24px;
                 height:6px;
                 margin:0 3px;
                 vertical-align: top;
                 background:#CCC;
                 cursor:pointer;
            }
            .swiper-pagination-bullet-active{
                opacity:1;
                background:#6699CC;
            }
        }
        
        /*按钮*/
        .slider-btns{
            position:absolute;
            padding:17px 12px;
            width:40px;
            height:64px;
            display:none;
            background:#6699cc;
            top:0;
            bottom:0;
            margin:auto;
            z-index:2;
            border-radius:5px;
            & i{
                background-repeat: no-repeat;
                background-image: url("/img/index/arrows.png");
                display:block;
                width: 16px;
                height: 28px;
            }
        }
        .slider-btns-pre{
            @extend .slider-btns;
            left:585px;
            & i{
                background-position:center -1px;
            }
        }
        .slider-btns-next{
            @extend .slider-btns;
            right: 413px;
            & i{
                background-position:center -31px;
            }
        }
    }
    .slider:hover .slider-btns{
        display:block;
    }
    .muen{
        position:absolute;
        top:0;
        width:200px;
        height:420px;
        background:#f5f5f5;
        .muen-list{
            width:200px;
            height:60px;
            .muen-text{
                .muen-text-bg{
                    width:20px;
                    height:20px;
                    margin:20px;
                    float:left;
                }
                & span{
                    width:140px;
                    height:60px;
                    display:block;
                    float:left;
                    font-size:16px;
                    color:#333333;
                    line-height:60px;
                }
            }
            .muen-box{
                position: absolute;
                // width:800px;
                left:200px;
                top:0;
                display:none;
                height:420px;
                background:rgba(255,255,255,.9);
                & li{
                    width:260px;
                    height:420px;
                    float:left;
                    & a{
                        display:block;
                        width:260px;
                        height:70px;
                        float:left;
                        overflow: hidden;
                        & img{
                            width:40px;
                            height:40px;
                            float:left;
                            margin-left:40px;
                            margin-top:15px;
                        }
                        & span{
                            width:160px;
                            height:40px;
                            line-height: 40px;
                            float:left;
                            color:#333;
                            margin-top:15px;
                            margin-left:20px;
                        }
                    }
                    & a:hover span{ 
                        color:#6699cc;
                    }
                }
            }
        }
        .muen-list:hover{
            background:#fff; 
        }
        .muen-list:hover .muen-text span{
            color:#6699cc;
        }
        .muen-list:hover .muen-box{
            display:block;
        }
    }
}

/* hot-product 热卖商品*/ 
.hot-product{
    width: 1170px;
    height:auto;
    overflow: hidden;
    .hot-list{
        width:100%;
        height:333px;
        & a{
            display: block;
            float:left;
            & dl{
                width:270px;
                margin:0 11px;
                height:auto;
                & dd{
                    width:270px;
                    height:270px;
                    & img{
                        @extend .imgSize;
                    }
                }
                & dt{
                    height:63px;
                    text-align: center;
                    .tpis{
                        height:42px;
                        line-height:42px;
                        width:100%;
                        padding:0 10px;
                        color:#333;
                        font-size:12px;
                    }
                    .price{
                        line-height:21px;
                        color:#e4397a;
                    }
                }
            }
        }
        & a:hover .tpis{
           color:#6699cc;
        }
    }
}

/*商品展示信息*/ 
.product-show{
    width:1172px;
    padding-bottom:80px;
    height:auto;
    .product-show-box{
        width:1172px;
        height:auto;
        border-top:1px solid #e5e5e5;
        border-left:1px solid #e5e5e5;
        .product-small-img{
            width:234px;
            height:287px;
            float:left;
            border-right:1px solid #e5e5e5;
            border-bottom:1px solid #e5e5e5;
            .product-small-img-wrap{
                width:234px;
                height:287px;
                display:block;
                & dl{
                    @extend .imgSize;
                    overflow: hidden;
                    & dd{
                        width:188px;
                        height:188px;
                        overflow: hidden;
                        margin:23px auto 0 auto;
                        & img{
                            @extend .imgSize;
                        }
                    }
                    & dt{
                        & p{
                            width:100%;
                            padding:0 20px;
                            line-height: 16px;
                            font-size:12px;
                            margin-top:10px;
                            text-align:center;
                            color:#333;
                        }
                        .price{
                            color:#e4397a;
                        }
                    }
                }
            }
            .product-small-img-wrap:hover img{
                transition: all .8s;
                transform: scale(1.1);
            }
        }
        .product-show-box-top{
            width:100%;
            height:286px;
            .product-big-img{
                @extend .product-small-img;
                width:468px;
                & img{
                    @extend .imgSize;
                }
            }
            
        }
        .product-show-box-bom{
            width:100%;
            height:286px;
        }
    }
}